<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>添加演唱会信息</title>
    <style>
        h2 {
            text-align: center;
        }

        .cc {
            margin-right: 545px;
        }

        #smallbox {
            width: 700px;
            margin: 0 auto;
        }

        label {
            width: 120px;
            display: inline-block;
        }

        input {
            flex: 1;
        }

        .pig {
            display: flex;
            justify-content: space-between;
        }

        p {
            text-align: center;
        }
    </style>
</head>
<body>
<h2>园区门禁管系统</h2>
<form action="add" method="post">
    <table>
        <tr>
            <td></td>
        </tr>
        <tr>
            <td>
                <label>负责人(*)</label>
            </td>
            <td>
                <input type="text" name="principal"/>
            </td>
        </tr>
        <tr>
            <td>
                <label>供货商(*)</label>
            </td>
            <td>
                <input type="text" name="supplier"/>
            </td>
        </tr>
        <tr>
            <td>
                <label>品牌(*)</label>
            </td>
            <td>
                <input type="text" name="brand"/>
            </td>
        </tr>
        <tr>
            <td>
                <label>所属楼宇(*)</label>
            </td>
            <td>
                <select name="buildingId">
                    <option value="">请选择</option>
                    <option value="1">北京花胜天成科研大楼</option>
                    <option value="2">软通动力大厦</option>
                    <option value="3">新浪总部大厦</option>
                    <option value="4">首农蓝海中心</option>
                    <option value="5">博彦科技大厦</option>
                    <option value="6">中兴通大厦</option>
                </select>
            </td>
        </tr>
        <tr>
            <td>
                <label>安装日期(*)</label>
            </td>
            <td>
                <input type="text" name="addTime"/>
            </td>
        </tr>
        <tr>
            <td>
                <input type="submit" value="添加">
                <input type="button" onclick="ret()" value="返回" class="bb">
            </td>
        </tr>
    </table>
</form>
<script src="js/jquery.min.js"></script>
<script>
    $(function () {
        $('form').submit(function () {

            // 获取字段值
            var principal = $("input[name='principal']").val();
            var supplier = $("input[name='supplier']").val();
            var brand = $("input[name='brand']").val();
            var buildingId = $("select[name='buildingId']").val();
            var addTime = $("input[name='addTime']").val();

            // 验证字段

            if(principal === "") {
                alert("负责人不能为空");
                return false;
            }

            if(supplier === "") {
                alert("供货商不能为空");
                return false;
            }

            if(brand === "") {
                alert("品牌不能为空");
                return false;
            }

            if(buildingId === "") {
                alert("请选择楼宇");
                return false;
            }

            if(addTime === "") {
                alert("请选择安装日期");
                return false;
            }

            var patt = /^\d{4}-\d{2}-\d{2}$/;

            if(!patt.test(addTime)) {
                alert("日期格式错误");
                return false;
            }

            // 所有验证通过
           this.submit();
        })
    })


    function ret() {
        location.href = 'main.jsp';
    }
</script>
</body>
</html>
